<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path;
%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
<title>学生请假-云校通</title>
<jsp:include page="/WEB-INF/page/common/_header.jsp"></jsp:include>
<body ontouchstart id="xsqj">
	<div class="weui_tab tab-bottom">
		<div class="weui_tab_bd">
	        <!--TAB切换-->
	        <div class="weui_tab" id="tab4">
	            <div class="weui_navbar">
	                <div class="weui_navbar_item ">
	                    待审核（<span id="pendingCount">0</span>）
	                </div>
	                <div class="weui_navbar_item" id="auditedTable">
	                    已审核
	                </div>
	            </div>
	            <div class="weui_tab_bd">
			        <div class="weui_panel weui_tab_bd_item" id="pendingTable">
			        </div>
			        <script id="pending-table-template" type="text/x-handlebars-template">
						{{#each rows}} 
			            <div class="qingjia">
				            <div class="weui_panel_bd">
				                <div class="weui_media_box weui_media_appmsg">
				                    <div class="weui_media_hd">
				                        <img class="weui_media_appmsg_thumb circle" src="${config.imgUrl}/{{headImgUrl}}" alt="">
				                    </div>
				                    <div class="weui_media_bd">
				                        <h4 class="weui_media_title">{{studentName}} <span class="f-gray f14">{{dateFormat createTime}}</span></h4>
				                        <div class="weui_media_desc f-black" style="display: inherit;">
				                        		<p><i class="icon icon-81 f-blue"></i> {{leaveTypeFormat leaveType}}</p>
				                        		<p><i class="icon icon-51 f-blue"></i> {{todateFormat startTime endTime}}</p>
				                        		<p><i class="icon icon-104 f-blue"></i> {{parentPhone}}</p>
				                        		<p><i class="icon icon-80 f-blue"></i> {{leaveReason}}</p>
				                        </div>
										{{#if attachList}}
										<div class="weui-flex">
											<div class="mailbox">
											{{#each attachList}}
                   								<img onclick="imgClick1(this)" src="${config.imgUrl}{{attachmentUrl}}">
                   							{{/each}}
											</div>
										</div>
										{{/if}}
				                        <div class="weui_media_fd weui_btn_area">
					                        <div class="btnWrap" onclick="rejectSubmit({{id}})">
						                    	<button class="weui_btn weui_btn_mini weui_btn_default">驳回请假</button>
					                        </div>
					                        <div class="btnWrap" onclick="agreeSubmit({{id}})">
						                    	<button class="weui_btn weui_btn_mini bg-blue">同意请假</button>
					                        </div>
						                    <div class="zhangtai"><img class="img-max" src="<%=basePath%>/images/daish.png"></div>
						                </div>
				                    </div>
				                </div>
				            </div>
			            </div>
			            {{/each}}
			        </script>
			        <div class="weui_panel weui_tab_bd_item weui_panel_access" style="margin-top:0;" id="weui_panel">
	   					<div class="weui_panel_bd page-content messages-content" id="auditedLeaveList">
	   					</div>
			        </div>
			        <script id="audited-table-template" type="text/x-handlebars-template">
		        		{{#each rows}}
			            <div class="weui_cell moments__post qingjia">
				            <div class="weui_panel_bd">
				                <div class="weui_media_box weui_media_appmsg">
				                    <div class="weui_media_hd">
				                        <img class="weui_media_appmsg_thumb circle" src="${config.imgUrl}/{{headImgUrl}}" alt="">
				                    </div>
				                    <div class="weui_media_bd">
				                        <h4 class="weui_media_title">{{studentName}} <span class="f-gray f14">{{dateFormat createTime}}</span></h4>
				                        <div class="weui_media_desc f-black" style="display: inherit;">
				                        		<p><i class="icon icon-81 f-blue"></i> {{leaveTypeFormat leaveType}}</p>
				                        		<p><i class="icon icon-51 f-blue"></i> {{todateFormat startTime endTime}}</p>
				                        		<p><i class="icon icon-104 f-blue"></i> {{parentPhone}}</p>
				                        		<p><i class="icon icon-80 f-blue"></i> {{leaveReason}}</p>
				                        </div>
										{{#if attachList}}
										<div class="weui-flex">
											<div class="mailbox">
											{{#each attachList}}
                   								<img onclick="imgClick1(this)" src="${config.imgUrl}{{attachmentUrl}}">
                   							{{/each}}
											</div>
										</div>
										{{/if}}
										{{#if rejectReason}}
										<div class="weui_media_desc f-black reject-reason">
											<p>驳回原因：{{rejectReason}}</p>
										</div>
										{{/if}}
				                        <div class="weui_media_fd  tright weui_btn_area">
					                    		<div class="zhangtai"><span class="f-blue">{{#statusFormat status}}{{/statusFormat}}</span></div>
					                    </div>
				                    </div>
				                </div>
				            </div>
			            </div>
			            {{/each}}
			        </script>
	            </div>
	        </div>
	        <!--EndTAB切换-->
		</div>
	</div>
	
	<div style="display:none;" id="weui_mask" class="weui_mask weui_mask_visible" style="transform-origin: 0px 0px 0px; opacity: 1; transform: scale(1, 1);"></div>
	<div style="display:none;" id="weui_dialog" class="weui_dialog weui_dialog_visible" style="transform-origin: 0px 0px 0px; opacity: 1; transform: scale(1, 1);">
		<div class="weui_dialog_hd">
			<strong class="weui_dialog_title">请输入驳回的原因</strong>
		</div>
		<div class="weui_dialog_bd">
			<textarea class="weui_input weui-prompt-input" style="height: 80px;width: 95%;" rows="10" id="rejectText"></textarea>
		</div>
		<div class="weui_dialog_ft">
			<a href="javascript:;" id="rejectCancel" class="weui_btn_dialog default">取消</a>
			<a href="javascript:;" id="rejectSure" class="weui_btn_dialog primary">确定</a>
		</div>
	</div>
</body>
<jsp:include page="/WEB-INF/page/common/_footer.jsp"></jsp:include>
<script>
	var isLoadAudited = false;
	$(function() {
		$('#tab4').tab({
			defaultIndex: 0,
			activeClass: "tab-blue "
		});
		if('${model}' != '') {
			loadPending();
			$("#auditedTable").click(function() {
				if(!isLoadAudited){
					loadAudited();
				}
			})
		}else {
			$.alert("学生请假只有班主任才有权限操作！", "温馨提示");
		}
	});
	function agreeSubmit(id) {
		$.confirm("确定同意请假吗?", "确认同意?", function() {
			var params = {
	   			id: id,
	   			status: '000'
	   		}
	   		auditSubmit(params);
        }, function() {
          //取消操作
        });
	}
	function rejectSubmit(id) {
		var id = id;
		$(".weui_mask").addClass("weui_mask_visible").show();
		$(".weui_dialog").addClass("weui_dialog_visible").show();
		$("#rejectCancel").click(function(){
			$("#rejectText").val(null);
			$("#weui_mask").hide();
			$("#weui_dialog").hide();
		});
		$("#rejectSure").click(function(){
			var text = $("#rejectText").val();
			if(text.trim().length > 0) {
	      		var params = {
	      			id: id,
	      			status: '002',
	      			rejectReason: text
	      		}
	      		auditSubmit(params);
	      	}
			$("#weui_mask").hide();
			$("#weui_dialog").hide();
		});
	}
	
	function auditSubmit(params) {
		$.ajax({
          	url : basePath + "/ls/student/leave/audit",
  	 		type : "post",
  	 		dataType : "json",
  	 		data : params,
            success: function(data){
            	if(data.code == '000') {
            		setTimeout(function() {
            			$.toast("操作成功");
            		}, 1000)
            		loadPending();
            		return;
            	}
            	$.toptips("提交失败，请联系管理员");
            },
            error: function(xhr, type){
              
            }
         });
	}
	
	function loadAudited() {
		isLoadAudited = true;
		//页数 
	    var page = 0;
	    // 每页展示5个
	    var size =10;
	    $('#weui_panel').dropload({
	        scrollArea : window,
	        autoLoad : true,//自动加载
	  		domDown : {//上拉
	            domClass   : 'dropload-down',
	            domRefresh : '<div class="dropload-refresh f15 "><i class="icon icon-20"></i>上拉加载更多</div>',
	            domLoad    : '<div class="dropload-load f15"><span class="weui-loading"></span>正在加载中...</div>',
	            domNoData  : '<div class="dropload-noData">没有更多数据了</div>'
	        },
	        domUp : {//下拉
	            domClass   : 'dropload-up',
	            domRefresh : '<div class="dropload-refresh"><i class="icon icon-114"></i>上拉加载更多</div>',
	            domUpdate  : '<div class="dropload-load f15"><i class="icon icon-20"></i>释放更新...</div>',
	            domLoad    : '<div class="dropload-load f15"><span class="weui-loading"></span>正在加载中...</div>'
	        },
	        loadDownFn : function(me){//加载更多
		        page++;
				window.params = {
					page: page,
		  	 		rows: size,
		  	 		grade: "${model.grade}",
	  	 			clazz: "${model.clazz}"
				};	            
		       	$.ajax({
		          	url : basePath + "/student/leave/audited",
		  	 		type : "post",
		  	 		dataType : "json",
		  	 		data : window.params,
		            success: function(data){
		         		 if(data.rows.length == 0 || window.params.page*window.params.rows >= data.total) {// 如果没有数据
		                      // 锁定
		                      me.lock();
		                      // 无数据
		                      me.noData();
		                  }
		                  // 为了测试，延迟1秒加载
		                  setTimeout(function(){
		                	loadAuditedHtml(data);
		                    var lazyloadImg = new LazyloadImg({
					            el: '.weui-updown [data-img]', //匹配元素
					            top: 50, //元素在顶部伸出长度触发加载机制
					            right: 50, //元素在右边伸出长度触发加载机制
					            bottom: 50, //元素在底部伸出长度触发加载机制
					            left: 50, //元素在左边伸出长度触发加载机制
					            qriginal: false, // true，自动将图片剪切成默认图片的宽高；false显示图片真实宽高
					            load: function(el) {
					                el.style.cssText += '-webkit-animation: fadeIn 01s ease 0.2s 1 both;animation: fadeIn 1s ease 0.2s 1 both;';
					            },
					            error: function(el) {
					
					            }
					        });
		                    // 每次数据加载完，必须重置
		                     me.resetload();
		                  },200);
		              },
		              error: function(xhr, type){
		              }
		          });
	        }
	    });
	}
	function loadPending() {
		$.ajax({
          	url : basePath + "/student/leave/pending",
  	 		type : "post",
  	 		dataType : "json",
  	 		data : {
  	 			grade: "${model.grade}",
  	 			clazz: "${model.clazz}"
  	 		},
            success: function(data){
            	if(data != null) {
            		$("#pendingCount").html(data.rows.length);
            		
            			var myTemplate = Handlebars.compile($("#pending-table-template").html());
            			Handlebars.registerHelper("equal", function(v1,v2,options) {
            				if(v1 == v2) {
            					//满足添加继续执行
            					return options.fn(this);
            				}else {
            					//不满足条件执行{{else}}部分
            					return options.inverse(this);
            				}
            			});
            			Handlebars.registerHelper("dateFormat", function(v1) {
            				return getTime(v1, "yyyy/MM/dd hh:mm");
            			});
            			
            			Handlebars.registerHelper("leaveTypeFormat", function(v1) {
            				if(v1 == 1) return "病假";
            				if(v1 == 2) return "事假";
            				return "";
            			});
            			
            			Handlebars.registerHelper("todateFormat", function(v1, v2) {
            				return getTime(v1, "MM/dd hh:mm") + "-" + getTime(v2, "MM/dd hh:mm");
            			});
            			$('#pendingTable').html(myTemplate(data));
            	}
            },
            error: function(xhr, type){
              
            }
         });
	}
	
	function loadAuditedHtml(data) {
		var myTemplate = Handlebars.compile($("#audited-table-template").html());
		Handlebars.registerHelper("equal", function(v1,v2,options) {
			if(v1 == v2) {
				//满足添加继续执行
				return options.fn(this);
			}else {
				//不满足条件执行{{else}}部分
				return options.inverse(this);
			}
		});
		Handlebars.registerHelper("dateFormat", function(v1) {
			return getTime(v1, "yyyy/MM/dd hh:mm");
		});
		
		Handlebars.registerHelper("leaveTypeFormat", function(v1) {
			if(v1 == 1) return "病假";
			if(v1 == 2) return "事假";
			return "";
		});
		
		Handlebars.registerHelper("statusFormat", function(v1,options) {
			if(v1 == '000') return "<img class='img-max' src='"+basePath+"/images/shenpitongguo.png'>";
			if(v1 == '002') return "<img class='img-max' src='"+basePath+"/images/shenpibohui.png'>";
			if(v1 == '003') return "已取消";
			return "";
		});
		
		Handlebars.registerHelper("todateFormat", function(v1, v2) {
			return getTime(v1, "MM/dd hh:mm") + "-" + getTime(v2, "MM/dd hh:mm");
		});
		$('#auditedLeaveList').append(myTemplate(data));
	}
	function imgClick1(thiz) {
		var obj = $(thiz.closest(".weui-flex")).find("img");
		var src = get_img(obj);
		var currSrc = thiz.src;
		var current;
		for(var i in src) {
			if(src[i] == currSrc) {
				current = i;
				break;
			}
		}
		img_preview(src[current], src);
	}
	function img_preview(current, urls){
        if(!current || urls.length == 0){
	        return ;
        }

        WeixinJSBridge.invoke('imagePreview', { 
            'current': current,
            'urls': urls
        }); 
	}
	function get_img(obj){
		var m = [];
		for(var i=0; i<obj.length; i++){
			m[i] = obj[i].src;
		}
		return m;
	}
</script>
</html>